<template>
  <n-layout class="h-full bg-transparent">
    <n-layout-content
      class="bg-transparent"
      style="height: 100vh"
      :native-scrollbar="false"
      content-style="height:inherit;"
    >
      <div class="flex h-full">
        <div
          class="login h-full w-1/2 flex-1 flex flex-col justify-center items-center bg-transparent"
        >
          <n-space vertical>
            <div class="top my-5">
              <div class="logo flex justify-center items-center">
                <img :src="logo" style="width: 70px; height: 70px" />
                <h1 class="text-4xl ml-4">{{ title }}</h1>
              </div>
            </div>
            <login-form></login-form>
          </n-space>
        </div>
        <div v-show="version" class="fixed bottom-3 right-5 text-sm font-bold">
          version {{ version }}
        </div>
      </div>
    </n-layout-content>
  </n-layout>
</template>

<script setup>
import { inject, ref } from "vue";
import LoginForm from "@/components/Login/LoginForm.vue";
import Logo from "@/assets/logo.png";
const version = inject < ref < "" >> "version";
const logo = Logo;
const title = "智慧粮食管理系统";
</script>
